import {defineStore} from 'pinia'

export const useThemesStore = defineStore('themes', () => {
    const themes = ref(import.meta.env.SSR ? 'light' : localStorage.getItem('themes') || 'light');
    
    if (!import.meta.env.SSR) {
        document.documentElement.setAttribute('data-theme', themes.value);
    }
    
    const getThemes = computed(() => themes.value)
    const setThemes = (theme) => {
        themes.value = theme;
        if (!import.meta.env.SSR) {
            localStorage.setItem('themes', theme);
        }
    }
    
    return { getThemes, setThemes }
})
